<!DOCTYPE html>
    <html>
    <head>
        <title>Upload Data</title>
        <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
        <style>
        /* 设置容器样式 */
        .container {
            max-width: 600px;
            margin: 180px auto;
            padding: 20px;
            text-align: center;
        }
        /* 设置表单样式 */
        form {
            margin-top: 20px;
        }
        /* 设置文件输入框样式 */
        input[type="file"] {
            margin-bottom: 20px;
        }
        /* 设置按钮样式 */
        button {
            background-color: #007BFF;
            color: white;
            padding: 10px 20px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }
        button:hover {
            background-color: #0056b3;
        }
        /* 设置消息提示样式 */
        .messages {
            margin-top: 20px;
            color: red;
        }
    </style>
    </head>
    <body>
        <div class="container">
            <h1>豆瓣电影网交互式数据分析系统</h1>
            <form action="/upload" method="post" enctype="multipart/form-data">
                <input type="file" name="file" accept=".csv,.xlsx,.xls" required>
                <button type="submit">上传文件</button>

            </form>
            {% with messages = get_flashed_messages() %}
                {% if messages %}
                    <div class="messages">
                        {% for message in messages %}
                            <p>{{ message }}</p>
                        {% endfor %}
                    </div>
                {% endif %}
            {% endwith %}
        </div>

    </body>
    </html>
